html, body, .container {
    height: 100%;
}

.container {
    display: flex;
    flex-direction: column;
    padding: .5rem .5rem 0;
}

.chartBox {
    display: flex;
    flex-direction: column;
    margin: .5rem;
    height: calc(100% - 1rem);
    background-color: #0d175066;
    box-shadow: 0 0 0.3rem 0.1rem rgba(0, 0, 0, .2);
}

.chartBox > .chartTitle {
    height: 2rem;
    position: relative;
    padding: .3rem 1rem;
    background-color: rgba(0, 0, 0, .2);
}

.chartBox > .chartTitle > h3 {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: .95rem;
    font-weight: normal;
}

.chartBox > .chartContent {
    display: flex;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
}

.chartBox > .chartContent > .chartBody {
    flex: 10;
}

.chartBox > .chartContent > .chartBody > [id^=ec] {
    height: 100%;
}

table {
    /*font-size: .84rem;*/
    width: 100%;
    /*height: 100%;*/
}

table tr {
    /*height: calc(2.5rem + 0%);*/
    /*height: 2.5rem ;*/
}
table{
    width: 100%;
}
tbody > tr > td {
    font-size: .8rem;
}


tbody > tr:hover > td {
    /*line-height: .5rem;*/
}

tbody > tr:nth-of-type(odd) {
    background-color: rgba(0, 0, 0, .35);
}

tbody > tr:nth-of-type(even) {
    background-color: rgba(0, 0, 0, .2);
}

td,
th {
    /*padding: .3rem 0;*/
    text-align: center;
}
table th:nth-of-type(1),
table td:nth-of-type(1){
    position: relative;
}
th {
    padding: .5rem 0;
    font-size: .9rem;
    background-color: #4c7aff66;
}
tbody > tr:hover > td {
    background-color: rgba(0,173,239,.01875);
}
td.more > a {
    display: block;
    /*height: 100%;*/
    line-height: 290%;
}

td.more:hover > a {
    color: var(--themeBlue);
}

td.more:active > a {
    color: #008AC9;
}


/*自定义下拉框*/
.mySelect {
    position: relative;
    display: inline-block;
    top: -.15em;
    width: 9rem;
    text-align: left;
    vertical-align: middle;
    z-index: 5;
}

.mySelect .myOption {
    cursor: pointer;
    padding: .1rem 2rem .1rem .5rem;
    white-space: nowrap;
}

.mySelect > .myOption.selected {
    position: relative;
    border: .1em solid var(--themeBlue);
    border-radius: .2rem;
    text-overflow: ellipsis;
    overflow: hidden;
    height: 1.3125rem;
    z-index: 5;
}

.mySelect.open > .myOption.selected,
.mySelect > .myOption.selected:hover {
    box-shadow: 0 0 .3em var(--themeBlue);
}

.mySelect > .myOption.selected:active {
    box-shadow: 0 0 .5em var(--themeBlue);
}

.mySelect > .myOption.selected > .icon {
    display: inline-block;
    position: absolute;
    top: .46rem;
    right: .5rem;
    width: .8rem;
    height: .3rem;
    background: url(../img/com/i_arrow_down.png) 50% 40% no-repeat;
    background-size: contain;
}

/*展开状态*/
.mySelect.open > .myOption.selected > .icon {
    transform: rotate(180deg);
}

.mySelect > .myOptionBox {
    position: absolute;
    display: none;
    margin-top: .3em;
    padding: 0;
    min-width: 100%;
    background: #004d7d;
    border-radius: .2rem;
    transition: all .5s ease;
    z-index:100;
    box-shadow: 0rem 0.2rem .2rem #1F547E;
}

.mySelect.open > .myOptionBox {
    display: block;
}

.mySelect > .myOptionBox > .myOption.selected {
    /*background-color: #00adef;*/
}

.mySelect > .myOptionBox > .myOption:hover {
    background-color: #00adef;
}


/*像风险查看一类页面的白色底样式*/

/*分页*/
@media all {
    .whitePage .pagination {
        height: 1.75rem;
        border: .05em solid #d0d0d0;
        border-top-color: #fff;
        background-color: #eee;
    }

    .whitePage .pagination > ul {
        height: 100%;
    }

    .whitePage .pagination > ul > li {
        top: -.05rem;
        padding-left: .5rem;
        padding-right: .5rem;
        height: 100%;
        font-size: .75rem;
        line-height: 1.75rem;
        display: inline-block;
        position: relative;
        cursor: pointer;
    }

    .whitePage .pagination > ul > li.split {
        padding-left: .1rem;
        padding-right: .1rem;
    }

    .whitePage .pagination > ul > li:hover {
        background-color: #ccc;
    }

    .whitePage .pagination > ul > li:active {
        background-color: #bbb;
    }

    .whitePage .pagination > ul > li.split:hover,
    .whitePage .pagination > ul > li.pageNumber:hover,
    .whitePage .pagination > ul > li.split:active,
    .whitePage .pagination > ul > li.pageNumber:active {
        cursor: initial;
        background-color: initial;
    }

    .whitePage .pagination .home:before,
    .whitePage .pagination .home:after,
    .whitePage .pagination .prev:before,
    .whitePage .pagination .next:after,
    .whitePage .pagination .end:before,
    .whitePage .pagination .end:after {
        content: "";
        display: inline-block;
        position: absolute;
        top: 55%;
        transform: translateY(-50%);
    }

    .whitePage .pagination .home:after,
    .whitePage .pagination .prev:before,
    .whitePage .pagination .next:after,
    .whitePage .pagination .end:before {
        left: .3rem;
        border: .45rem solid #bbb;
        border-top-color: transparent;
        border-bottom-color: transparent;
    }

    .whitePage .pagination .home:after {
        left: 0;
    }

    .whitePage .pagination .home:after,
    .whitePage .pagination .prev:before {
        border-left-color: transparent;
    }

    .whitePage .pagination .next:after,
    .whitePage .pagination .end:before {
        border-right-color: transparent;
    }

    .whitePage .pagination .home {
        padding-left: 1.3rem;
    }

    .whitePage .pagination .end {
        padding-left: 1.6rem;
    }

    .whitePage .pagination .prev,
    .whitePage .pagination .next {
        padding-left: 1rem;
    }

    .whitePage .pagination .home:before,
    .whitePage .pagination .end:after {
        left: .3rem;
        width: .15rem;
        height: .8rem;
        background-color: #bbb;
    }

    .whitePage .pagination .end:after {
        left: 0.8rem;
    }

    .whitePage .pagination .prev:before {
        left: -.3rem;
    }

    /*.whitePage input::placeholder {*/
        /*color: red;*/
    /*}*/

    .whitePage .pagination input#pageCurrent {
        width: 2.5rem;
    }

    .whitePage .output ul {
        z-index: 1;
        position: absolute;
        margin-left: -.5rem;
        width: 10rem;
        background: #eee;
    }

    .whitePage .output ul > li {
        padding-left: .2rem;

    }

    .whitePage .output ul > li:hover {
        background: #ccc;
    }

    .whitePage .output ul > li > .icon {
        display: inline-block;
        position: relative;
        top: .15rem;
        width: 1rem;
        height: 1rem;
        background-size: contain;
    }
    .whitePage .output ul > li.pdf > .icon {
        background-image: url("../img/output/pdf.png");
    }
    .whitePage .output ul > li.excel > .icon {
        background-image: url("../img/output/excel.png");
    }
    .whitePage .output ul > li.word > .icon {
        background-image: url("../img/output/word.png");
    }
    .whitePage .output ul > li.picture > .icon {
        background-image: url("../img/output/picture.png");
    }
    .whitePage .output ul > li > ul {
        top: 1.7rem;
        left: 10.5rem;
    }

    .whitePage .output ul,
    .whitePage .output ul ul {
        border: .1rem solid #ddd;
    }

    .whitePage .output ul {
        display: none;
    }

    .whitePage .output ul > li:hover ul {
        display: block;
    }
}

/*表单和折叠*/
@media all {
    .whitePage .formBox {
        position: relative;
        display: none;
    }

    .whitePage .formBox + .formFoldHandle {
        position: relative;
        left: 50%;
        top: 0;
        width: 8rem;
        height: .5rem;
        transform: translateX(-50%) rotate(180deg);
        background: url("../img/com/formFoldHandle.png") no-repeat;
        background-size: contain;
        cursor: pointer;
    }

    .whitePage .formBox.open + .formFoldHandle {
        top: auto;
        bottom: -.5rem;
        transform: translateX(-50%);
    }

    .whitePage .formBox.open {
        display: block;
    }

    .whitePage form {
        width: 58rem;
        margin: auto;
    }

    .whitePage form select {
        width: 9rem;
    }

    .whitePage form label {
        display: inline-block;
        width: 6rem;
        text-align: right;
        color: #333;
    }

    .whitePage form input {
        width: 9rem;
    }
}

/*.whitePage table*/
@media all {
    .whitePage .tableBox {
        width: 100%;
        overflow: hidden;
    }

    .whitePage .tableBox:hover {
        overflow: auto;
    }

    .whitePage table {
        border: .1rem solid #ddd;
    }

    .whitePage table tr {
        white-space: nowrap;
    }
    .whitePage tbody > tr:hover > td {
        background-color: #fff;
    }

    .whitePage table > thead > tr > th,
    .whitePage table > tbody > tr > td {
        font-size: .83rem;
        padding: 0.05rem 1rem;
    }
    .whitePage table td:nth-of-type(1){
        background-color: #fff;
    }

    .whitePage table > thead > tr > th {
        font-weight: normal;
        color: #fff;
        background-color: var(--themeBlue);
    }

    .whitePage table > tbody > tr > td {
        border: .1rem solid #ddd;
        background-color: #fff;

    }

}

/*白色页面其他样式*/
@media all {
    .whitePage .container {
        color: #333;
        padding: 0;
        background-color: #fff;
        overflow-x: auto;
    }

    .whitePage * {
        color: inherit;
    }

    .whitePage .inputGroup {
        margin-top: .8rem;
        font-size: .8rem;
    }

    .whitePage .btnGroup {
        display: inline-block;
    }

    .whitePage .btnGroup > button {
        width: 6rem;
    }

    .whitePage .search {
        margin-left: 1rem;
    }

    .whitePage .queryResult {
        margin: .6rem;
        font-size: .75rem;
        color: #999;
    }

}

/*滚动条样式*/
@media all  {
    *::-webkit-scrollbar {/*滚动条整体样式*/
        width: 10px;     /*高宽分别对应横竖滚动条的尺寸*/
        height: 10px;
    }
    *::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        background: rgba(0,0,0,0.2);
    }
    *::-webkit-scrollbar-track {/*滚动条里面轨道*/
        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
        border-radius: 0;
        background: rgba(0,0,0,0.1);
    }
}





